<script setup lang="ts">
import { useRouter } from 'vue-router'
const props = withDefaults(
  defineProps<{
    title?: string
    rightText?: string
    back?: () => void
  }>(),
  {
    title: '',
    rightText: ''
  }
)
const emit = defineEmits<{
  (e: 'click-left'): void
}>()
const router = useRouter()
const onClickLeft = () => {
  if (props.back) {
    return props.back()
  }
  // 判断历史记录中是否有回退
  else {
    if (history.state?.back) {
      router.back()
    } else {
      router.push('/')
    }
  }
}
// const onClickedRight = () => {}
</script>

<template>
  <van-nav-bar fixed left-arrow :title="title" :right-text="rightText" @click-left="onClickLeft">
  </van-nav-bar>
</template>

<style lang="scss" scoped>
:deep() {
  .van-nav-bar {
    &__arrow {
      font-size: 18px;
      color: var(--cp-text1);
    }
    &__text {
      font-size: 15px;
    }
  }
}
</style>
